<template>
    <div>
        <!--
                <input type="text" v-model="msg">
                <br>
                {{msg}}
-->
        <!--        <input type="text" :value="msg" @input="inchange">-->
        <!--        <input type="text" :value="msg" @input="msg=$event.target.value">-->
        <!--        <input type="text" v-model.lazy="msg">-->
        <!--
                <input type="number" v-model.number="msg">
                <br>
                {{typeof(msg)}}=>{{msg}}
-->
        <!--
                <input type="text" v-model.trim="msg">
                <br>
                {{typeof(msg)}}=>{{msg}}
-->
        <!--
                <label for="one">
                    <input id="one" type="radio" value="man" v-model="sex">man
                </label>
                <label for="two">
                    <input id="two" type="radio" value="woman" v-model="sex">woman
                </label>
                <br>
                {{sex}}
-->
        <label for="a">
            <input id="a" type="checkbox" v-model="isAgree">agree?{{isAgree}}
        </label>
        <br>
        <label for="b">
            <input id="b" type="checkbox" value="b" v-model="tags">b
        </label>
        <label for="c">
            <input id="c" type="checkbox" value="c" v-model="tags">c
        </label>
        <label for="d">
            <input id="d" type="checkbox" value="d" v-model="tags">d
        </label>
        <label for="e">
            <input id="e" type="checkbox" value="e" v-model="tags">e
        </label>
        <br>
        {{tags}}
        <br>

        <select v-model="lvl" multiple>
            <option value="a">a</option>
            <option value="b">b</option>
            <option value="c">c</option>
            <option value="d">d</option>
            <option value="e">e</option>
        </select>
        <br>
        {{lvl}}
    </div>
</template>

<script>
    export default {
        name: "App",
        data() {
            return {
                msg: "aaaa",
                sex: 'man', //不用再checked
                isAgree: true,
                tags: [],
                lvl: 'b', //默认值
            }
        },
        methods: {
            inchange(event) {
                this.msg = event.target.value;
            }
        }
    }
</script>

<style scoped>

</style>